$(function() {
    var form = layui.form
    var layer = layui.layer

    function getlogin() {
        $.ajax({
            method: 'POST',
            url: '/api/login',
            data: {
                username: 'admin',
                password: 'admin'
            },

            success: function(res) {
                if (res.status !== 0) {
                    return console.log(res.message);
                }
                // console.log(res);
                // console.log(res.token);
                localStorage.setItem('token', res.token)

            }
        })
    }
    // getlogin()

    initArtCateList()


    // 添加链接
    var indexAdd = null
    $('#add-link').on('click', function() {
        indexAdd = layer.open({
            type: 1,
            area: ['600px', '350px'],
            title: '添加文章分类',
            content: $('#add-form-tpl').html()
        });
    })


    $('body').on('click', '#urlIcon_1', function() {
        $('#linkFile').click()
    })

    // 保存文件对象
    var file = null
    $('body').on('change', '#linkFile', function(e) {
        // 1. 初始化图片裁剪器
        var $image = $('#preIcon')
            // 获取到文件的列表数组
        var filelists = e.target.files
            // 判断用户是否选择了文件
        if (filelists.length === 0) {
            return file = null
        }
        // 根据文件， 创建对应的 URL 地址
        var newImgURL = URL.createObjectURL(filelists[0])
            // console.log(newImgURL);
            // 为裁剪区域重新设置图片
        $image.attr('src', newImgURL) // 重新设置图片路径

        file = filelists[0]
    })

    $('body').on('submit', "#add-form", function(e) {
        e.preventDefault()

        var fd = new FormData($(this)[0])
            /*   fd.forEach(function(v, k) {
                  console.log(k);
                  console.log(v);
              }) */

        /* fd.append('linkname', $("#add-form [name=linkname]").val())
        fd.append('linkurl', $("#add-form [name=linkurl]").val())
        fd.append('linkdesc', $("#add-form [name=linkdesc]").val())
        fd.append('linkicon', file) */
        /* for (var key of fd.keys()) {
            console.log(key, fd.get(key));
        } */

        // 发布文章成功后，跳转到文章列表页面
        function publishLink(fd) {
            $.ajax({
                type: 'POST',
                url: '/admin/links',
                data: fd,
                contentType: false,
                processData: false,
                success: function(res) {

                    if (res.status !== 0) {
                        // console.log(111);
                        return layer.msg('编辑链接失败')
                    }
                    initArtCateList()
                        // console.log(222);
                    console.log(res);
                    layer.msg('编辑链接成功')
                    layer.close(indexAdd)
                }
            })
        }
        // 发送ajax请求，实现文章发布
        publishLink(fd)

    })



    // 保存文件对象
    var file1 = null



    // 编辑功能
    var indexEdit = null
    var id = null
    $('tbody').on('click', "#btn_edit", function() {
        indexEdit = layer.open({
            type: 1,
            area: ['600px', '350px'],
            title: '添加文章分类',
            content: $('#edit-form-tpl').html()
        });

        id = $(this).attr('data_id')
            // console.log(id);
        $.ajax({
            type: 'GET',
            url: '/admin/links/' + id,
            success: function(res) {
                form.val('editForm', res.data)

            }
        })

    })


    $('body').on('submit', '#edit-form', function(e) {
        e.preventDefault()
        var fd = new FormData($(this)[0])
        console.log(fd);
        // fd.append('linkicon', file)
        // console.log(id);

        fd.append('linkicon', file1)

        fd.forEach(function(v, k) {
                console.log(k);
                console.log(v);
            })
            /*   fd.append('linkname', $("#add-form [name=linkname]").val())
              fd.append('linkurl', $("#add-form [name=linkurl]").val())
              fd.append('linkdesc', $("#add-form [name=linkdesc]").val()) */
        function pageRead(fd) {
            $.ajax({
                type: 'PUT',
                url: '/admin/links/' + id,
                data: fd,
                contentType: false,
                processData: false,
                success: function(res) {
                    if (res.status !== 0) {
                        return layer.msg('更新分类数据失败！')
                    }
                    console.log(res);
                    layer.msg('更新分类数据成功！')
                    layer.close(indexEdit)
                    initArtCateList()
                }
            })
        }

        pageRead(fd)

    })

    $('body').on('click', '#urlIcon', function() {
        $('#linkFile1').click()
    })

    $('body').on('change', '#linkFile1', function(e) {
        var $image = $('#preIcon1')
            // 获取到文件的列表数组
        var filelists = e.target.files
            // 判断用户是否选择了文件
        if (filelists.length === 0) {
            return file1 = null
        }

        // console.log(name);
        // 根据文件，创建对应的 URL 地址
        var newImgURL = URL.createObjectURL(filelists[0])
            // 为裁剪区域重新设置图片
        $image.attr('src', newImgURL) // 重新设置图片路径
        file1 = filelists[0]
    })


    // 删除功能

    $('tbody').on('click', '#btn_del', function() {
        // alert('111')
        var id = $(this).attr('data_id')
        layer.confirm('确认删除?', { icon: 3, title: '提示' }, function(index) {
            $.ajax({
                method: 'DELETE',
                url: '/admin/links/' + id,
                success: function(res) {
                    if (res.status !== 0) {
                        console.log(res);
                        return layer.msg('删除友情链接失败！')

                    }
                    layer.msg('删除友情链接成功！')
                    layer.close(index)

                    initArtCateList()
                }
            })


        })
    })


    // 渲染页面
    function initArtCateList() {
        $.ajax({
            type: 'GET',
            url: '/admin/links',
            success: function(res) {
                // console.log(res);
                if (res.status !== 0) {
                    return layer.msg('获取失败！')
                }
                // console.log(res);
                var htmlStr = template('page_readering', res)
                    // console.log(htmlStr);
                $('tbody').html(htmlStr)
            }
        })
    }

})